li
  div style='display: flex;'
    p
      i
        = i
        |、
    div style="flex: 1 1 auto"
      div
        p style="font-size: 16px; font-weight: bold;"
          = obj.title
        p style='word-break: break-all;'
          = obj.content
        hr
      div style='text-align: right;'
        = button_tag "like(#{obj.followed.count})", onclick: "to_ajax(this, '#{follow_blog_blog_path(obj.id)}');", id: "followed_for_#{obj.id}", class: 'btn btn-success'
        |&nbsp;&nbsp;
        = button_tag "dislike(#{obj.unfollowed.count})", onclick: "to_ajax(this, '#{cancel_follow_blog_blog_path(obj.id)}');", id: "unfollowed_for_#{obj.id}", class: 'btn btn-default'
        |&nbsp;&nbsp;
        - if obj.user_id == @current_user_id
          = link_to 'delete', blog_path(obj.id), method: :delete, class: 'btn btn-danger'
        hr
      div
        = button_tag 'add comment', onclick: "$('#new_comment_#{obj.id}').toggle(500);"
      = form_for Comment.new, html: {id: "new_comment_#{obj.id}", style: 'margin: 0 30px;display: none;',  remote: true} do |f|
        = hidden_field_tag 'comment[blog_id]', obj.id
        = hidden_field_tag 'comment[user_id]', @current_user_id
        .field
          = f.label :detail
          = f.text_area :detail, placeholder: "add new comment..."
        = f.submit 'submit', class: "btn btn-primary"
      div id="comments_for_#{obj.id}"
        - if obj.comments.present?
          = render partial: 'blogs/comments', locals: {obj: obj, comments: obj.comments}
